<template>
  <el-dialog :title="title"
             :visible.sync="dialogData.show"
             center
             @close="$emit('closedialog')"
             :close-on-click-modal="false"
             width="60%">
    <el-form :model="formdata"
             :rules="formRules"
             ref="formRefs"
             label-position="right"
             label-width="125px">
      <el-form-item label="套餐名称："
                    prop="name">
        <el-input v-model="formdata.name"
                  maxlength="20"
                  autocomplete="off"
                  style="width:70%"
                  clearable
                  placeholder="请输入套餐名称"></el-input>
      </el-form-item>
      <el-form-item label="适用对象："
                    prop="applicableThrongIds">
        <el-select v-model="formdata.applicableThrongIds"
                   multiple
                   placeholder="请选择适用对象">
          <el-option v-for="it in applicableThrongList"
                     :key="it.id"
                     :label="it.name"
                     :value="it.id"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="套餐特点："
                    prop="characteristicIds">
        <el-select v-model="formdata.characteristicIds"
                   multiple
                   placeholder="请选择套餐特点">
          <el-option v-for="it in characteristicList"
                     :key="it.id"
                     :label="it.characteristic"
                     :value="it.id"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="套餐图片："
                    prop="imageUrl">
        <el-upload class="avatar-uploader"
                   :action="imageUploadUrl"
                   :show-file-list="false"
                   accept=".JPG, .PNG, .JPEG,.jpg, .png, .jpeg"
                   :on-success="handleAvatarSuccess"
                   :before-upload="beforeAvatarUpload">
          <img v-if="formdata.imageUrl"
               :src="formdata.imageUrl"
               class="avatar" />
          <i v-else
             class="el-icon-plus avatar-uploader-icon"></i>
        </el-upload>
      </el-form-item>
      <el-form-item label="客户医院："
                    prop="hospitalId">
        <Select v-model="formdata.hospitalId"
                filterable
                remote
                clearable
                :loading="loading1"
                placeholder="请输入客户医院"
                @on-change="hospitalChange"
                :remote-method="gethospitalList"
                class="w-200">
          <Option v-for="(option, index) in options1"
                  :value="parseInt(option.hospitalId)"
                  :key="index">{{ option.name }}</Option>
        </Select>
      </el-form-item>
      <el-form-item label="体检院区："
                    prop="hospitalBranchIds">
        <el-select v-model="formdata.hospitalBranchIds"
                   multiple
                   style="width:70%"
                   placeholder="请选择体检院区">
          <el-option v-for="it in hospitalBranchList"
                     :key="it.id"
                     :label="it.branchName"
                     :value="it.id"></el-option>
        </el-select>
      </el-form-item>
      <el-row>
        <el-col :span="8">
          <el-form-item label="套餐总价："
                        prop="totalPrice">
            <el-input v-model="formdata.totalPrice"
                      clearable
                      maxlength="20"
                      autocomplete="off"
                      type="number"
                      placeholder="请输入套餐总价"
                      style="width:100%"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="适用性别："
                        prop="applicability">
            <el-select placeholder="请选择性别"
                       v-model="formdata.applicability"
                       @change="chagneSex">
              <el-option v-for="item in sexList"
                         :key="item.value"
                         :label="item.label"
                         :value="parseInt(item.value)">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-form-item label="套餐内容：">
        <el-button type="success"
                   @click="handleAdd('combo', tableData)">新 增 一 行</el-button>
        <el-table :data="tableData"
                  class="mt-20"
                  style="width: 100%"
                  border>
          <el-table-column prop="date"
                           label="检查方式">
            <template slot-scope="scoped">
              <el-input v-model.trim="scoped.row.checkMethod"
                        placeholder="请输入检查方式"
                        clearable
                        maxlength="50"></el-input>
            </template>
          </el-table-column>
          <el-table-column prop="name"
                           label="检查项目">
            <template slot-scope="scoped">
              <el-input v-model.trim="scoped.row.checkName"
                        clearable
                        placeholder="请输入检查项目"
                        maxlength="50"></el-input>
            </template>
          </el-table-column>
          <el-table-column prop="address"
                           label="临床意义">
            <template slot-scope="scoped">
              <el-input v-model.trim="scoped.row.significance"
                        clearable
                        placeholder="请输入临床意义"
                        maxlength="250"></el-input>
            </template>
          </el-table-column>
          <el-table-column prop="address"
                           label="价格（男）">
            <template slot-scope="scoped">
              <el-input v-model="scoped.row.manPrice"
                        maxlength="8"
                        type="number"
                        placeholder="请输入价格"
                        clearable
                        :disabled="isShowInput"></el-input>
            </template>
          </el-table-column>
          <el-table-column prop="address"
                           label="价格（女）">
            <template slot-scope="scoped">
              <el-input v-model="scoped.row.womanPrice"
                        maxlength="8"
                        type="number"
                        placeholder="请输入价格"
                        clearable
                        :disabled="isShowInput"></el-input>
            </template>
          </el-table-column>
          <el-table-column prop="address"
                           label="操作">
            <template slot-scope="scoped">
              <el-button type="danger"
                         @click="handleDel('combo', tableData,scoped.$index)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-form-item>
      <el-form-item label="其他项目："
                    prop="tableData1">
        <el-button type="success"
                   @click="handleAdd ('other', tableData1)">新 增 一 行</el-button>
        <el-table :data="tableData1"
                  style="width: 100%"
                  class="mt-20"
                  border>
          <el-table-column prop="name"
                           label="检查项目">
            <template slot-scope="scoped">
              <el-input v-model.trim="scoped.row.checkName"
                        placeholder="请输入检查项目"
                        clearable
                        maxlength="50"></el-input>
            </template>
          </el-table-column>
          <el-table-column prop="address"
                           label="临床意义">
            <template slot-scope="scoped">
              <el-input v-model.trim="scoped.row.significance"
                        placeholder="请输入临床意义"
                        clearable
                        maxlength="250"></el-input>
            </template>
          </el-table-column>
          <el-table-column prop="address"
                           label="价格（男）">
            <template slot-scope="scoped">
              <el-input v-model="scoped.row.manPrice"
                        maxlength="8"
                        :disabled="isShowInput"
                        placeholder="请输入价格"
                        clearable
                        type="number"></el-input>
            </template>
          </el-table-column>
          <el-table-column prop="address"
                           label="价格（女）">
            <template slot-scope="scoped">
              <el-input v-model="scoped.row.womanPrice"
                        maxlength="8"
                        type="number"
                        placeholder="请输入价格"
                        clearable
                        :disabled="isShowInput"></el-input>
            </template>
          </el-table-column>
          <el-table-column prop="address"
                           label="操作">
            <template slot-scope="scoped">
              <el-button type="danger"
                         @click="handleDel('other', tableData1, scoped.$index)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-form-item>
      <h3>可选服务:</h3>
      <el-form-item label="套餐内容：">
        <el-button type="success"
                   @click="handleAdd('optionalPackage', tableData2)">新 增 一 行</el-button>
        <el-table :data="tableData2"
                  style="width: 100%"
                  class="mt-20"
                  border>
          <!-- <el-table-column  prop="date"  label="检查方式">
                <template slot-scope="scoped"> 
                    <el-input v-model.trim="scoped.row.checkMethod" maxlength="50"></el-input>
                </template>
            </el-table-column> -->
          <el-table-column prop="name"
                           label="检查项目">
            <template slot-scope="scoped">
              <el-input v-model.trim="scoped.row.checkName"
                        placeholder="请输入检查项目"
                        clearable
                        maxlength="50"></el-input>
            </template>
          </el-table-column>
          <el-table-column prop="address"
                           label="临床意义">
            <template slot-scope="scoped">
              <el-input v-model.trim="scoped.row.significance"
                        placeholder="请输入临床意义"
                        clearable
                        maxlength="250"></el-input>
            </template>
          </el-table-column>
          <el-table-column prop="address"
                           label="价格（男）">
            <template slot-scope="scoped">
              <el-input v-model="scoped.row.manPrice"
                        maxlength="8"
                        placeholder="请输入价格"
                        clearable
                        type="number"></el-input>
            </template>
          </el-table-column>
          <el-table-column prop="address"
                           label="价格（女）">
            <template slot-scope="scoped">
              <el-input v-model="scoped.row.womanPrice"
                        maxlength="8"
                        placeholder="请输入价格"
                        clearable
                        type="number"></el-input>
            </template>
          </el-table-column>
          <el-table-column prop="address"
                           label="操作">
            <template slot-scope="scoped">
              <el-button type="danger"
                         @click="handleDel('optionalPackage',tableData2,scoped.$index)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-form-item>
      <el-form-item label="其他项目：">
        <el-button type="success"
                   @click="handleAdd ('otherService', tableData3)">新 增 一 行</el-button>
        <span style="color:red;font-size:12px">注：套餐内容为空，其他项目填写提交无效</span>
        <el-table :data="tableData3"
                  style="width: 100%"
                  class="mt-20"
                  border>
          <el-table-column prop="name"
                           label="检查项目">
            <template slot-scope="scoped">
              <el-input v-model.trim="scoped.row.checkName"
                        placeholder="请输入检查项目"
                        clearable
                        maxlength="50"></el-input>
            </template>
          </el-table-column>
          <el-table-column prop="address"
                           label="临床意义">
            <template slot-scope="scoped">
              <el-input v-model.trim="scoped.row.significance"
                        placeholder="请输入临床意义"
                        clearable
                        maxlength="250"></el-input>
            </template>
          </el-table-column>
          <el-table-column prop="address"
                           label="价格（男）">
            <template slot-scope="scoped">
              <el-input v-model="scoped.row.manPrice"
                        maxlength="8"
                        placeholder="请输入价格"
                        clearable
                        type="number"></el-input>
            </template>
          </el-table-column>
          <el-table-column prop="address"
                           label="价格（女）">
            <template slot-scope="scoped">
              <el-input v-model="scoped.row.womanPrice"
                        maxlength="8"
                        placeholder="请输入价格"
                        clearable
                        type="number"></el-input>
            </template>
          </el-table-column>
          <el-table-column prop="address"
                           label="操作">
            <template slot-scope="scoped">
              <el-button type="danger"
                         @click="handleDel('other', tableData3, scoped.$index)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-form-item>
      <el-form-item label="补充说明："
                    prop="supplement">
        <el-button type="success"
                   style="margin-bottom:5px"
                   @click="handleAdd('supplement', null)">新 增
        </el-button>
        <div v-for="(it, index) in supplementList"
             :key="index">
          <el-input v-model="it.value"
                    autocomplete="off"
                    style="width:70%"
                    placeholder="请输入补充说明"
                    clearable
                    maxlength="100"></el-input>
          <el-button type="danger"
                     style="margin-bottom:5px"
                     @click="handleDel('supplement',supplementList, index)">删 除</el-button>
        </div>
      </el-form-item>
      <el-form-item label="每日预约名额："
                    prop="dailyReservationQuota">
        <el-input v-model="formdata.dailyReservationQuota"
                  maxlength="8"
                  type="number"
                  autocomplete="off"
                  placeholder="请输入每日预约名额"
                  clearable
                  style="width:70%"></el-input>
      </el-form-item>
      <el-form-item label="业务绑定："
                    prop="physicalExaminationBusinessId">
        <el-select v-model="formdata.physicalExaminationBusinessId"
                   placeholder="请选择业务"
                   clearable>
          <el-option v-for="item in options"
                     :key="item.id"
                     :label="item.name"
                     :value="item.id">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="每单推广费用：">
        <el-input v-model="formdata.extendFee"
                  maxlength="8"
                  type="number"
                  autocomplete="off"
                  clearable
                  placeholder="请输入每单推广费用"
                  style="width:50%"></el-input>
      </el-form-item>
      <el-form-item label="购买服务后，是否填写健康服务号："
                    label-width="240px">
        <el-radio-group v-model="formdata.isInvitationCode">
          <el-radio :label="1">是</el-radio>
          <el-radio :label="0">否</el-radio>
        </el-radio-group>
      </el-form-item>
    </el-form>
    <div slot="footer"
         class="dialog-footer">
      <el-button @click="$emit('closedialog')">取 消</el-button>
      <el-button type="success"
                 @click="submitForm">确 认</el-button>
    </div>
  </el-dialog>
</template>

<script>
  export default {
    props: ["dialogData"],
    data () {
      return {
        sexList: [
          { value: 0, label: "女" },
          { value: 1, label: "男" },
          { value: 2, label: "通用" }
        ],
        sexName: "",
        isShowInput: false,
        formdata: {
          name: "", // 套餐名称
          imageUrl: null,
          supplement: [], // 补充说明
          applicableThrongIds: [], // 适用对象
          characteristicIds: [], // 套餐特点
          hospitalBranchIds: [], // 体检院区
          physicalExamItemList: [], // 套餐内容
          totalPrice: '',
          applicability: "", // 性别
          physicalExaminationBusinessId: "", // 业务绑定
          extendFee: "", // 推广费用
          way: "", // 推广方式
          isInvitationCode: 0
        },
        supplementList: [],
        tableData: [{ type: 1 }],
        tableData1: [],
        tableData2: [],
        tableData3: [],
        imageUploadUrl: this.api.appUpgradeUpload.url,
        title: '新增体检',
        loading1: false,
        options: [],
        options1: [],
        applicableThrongList: [], // 适用对象
        characteristicList: [], // 套餐特点
        hospitalBranchList: [], // 体检院区
        formRules: {
          name: [{ required: true, message: '请输入套餐名称', trigger: 'blur' }],
          applicableThrongIds: [{ required: true, message: '请选择适用对象', trigger: 'change' }],
          characteristicIds: [{ required: true, message: '请选择套餐特点', trigger: 'change' }],
          imageUrl: [{ required: true, message: '请上传套餐图片', trigger: 'blur' }],
          hospitalId: [{ required: true, message: '请输入客户医院', trigger: 'change' }],
          hospitalBranchIds: [{ required: true, message: '请选择体检院区', trigger: 'change' }],
          dailyReservationQuota: [{ required: true, message: '请输入每日预约名额', trigger: 'blur' }],
          physicalExaminationBusinessId: [{ required: true, message: '请选择业务', trigger: 'change' }],
        },
      };
    },
    watch: {
      'formdata.totalPrice': {
        handler (val) {
          if (val && val !== undefined) {
            this.isShowInput = true;
            this.tableData = this.tableData.map(item => ({
              ...item,
              womanPrice: null,
              manPrice: null
            }));
            this.tableData1 = this.tableData1.map(item => ({
              ...item,
              womanPrice: null,
              manPrice: null
            }));
          } else {
            this.isShowInput = false;
            this.tableData = this.tableData.map(item => ({
              ...item,
              womanPrice: item.womanPrice,
              manPrice: item.manPrice
            }));
            this.tableData1 = this.tableData1.map(item => ({
              ...item,
              womanPrice: item.womanPrice,
              manPrice: item.manPrice
            }));
          }
        },
        deep: true
      }
    },
    methods: {
      hospitalChange (val) {
        if (val) {
          this.post(this.api.cooperationHospital.getHospitalBranchPage, {
            hospitalId: val,
            pageIndex: 0,
            pageSize: 100
          }).then(res => {
            if (res.data.code === '200') {
              this.hospitalBranchList = res.data.object;
            }
          });
        } else {
          this.formdata.hospitalBranchIds = [];
          this.$message.error('请选择医院!');
        }

      },
      _getList () {
        let param = {
          pageIndex: 0,
          pageSize: 100
        };
        // 适用对象
        this.post(this.api.cooperationHospital.getApplicableThrongPage, param).then(res => {
          if (res.data.code === '200') {
            this.applicableThrongList = res.data.object;
          }
        });
      },
      _getList1 () {
        let param = {
          pageIndex: 0,
          pageSize: 100
        };
        this.post(this.api.cooperationHospital.getCharacteristicPage, param).then(
          res => {
            if (res.data.code === '200') {
              this.characteristicList = res.data.object;
            }
          }
        );
      },

      handleAdd (option, data) {
        // 套餐内容
        if (option === 'combo') {
          data.push({ type: 1 });
        }
        // 其他项目
        if (option === 'other') {
          data.push({ type: 2 });
        }
        // 可选服务 - 套餐内容
        if (option === 'optionalPackage') {
          data.push({ type: 3 });
        }
        // 可选服务 - 套餐内容
        if (option === 'otherService') {
          if (!this.tableData2.length) {
            this.$message.warning("可选套餐内容未添加");
            return;
          } else {
            data.push({ type: 4 });
          }
        }
        // 补充说明
        if (option === 'supplement') {
          this.supplementList.push({ value: '' });
        }
      },
      handleDel (option, data, index) {
        // 补充说明
        if (option === 'supplement') {
          data.splice(index, 1);
        }
        if (option === 'other') {
          data.splice(index, 1);
        }
        // 套餐内容
        if (option === 'combo') {
          if (data.length == 1) {
            this.$message.warning("至少保留一行");
          } else {
            data.splice(index, 1);
          }
        }
        // 可选服务 - 套餐内容
        if (option === 'optionalPackage') {
          data.splice(index, 1);
          if (data.length == 0) {
            this.tableData3 = [];
          }
        }
      },
      // 提交
      submitForm () {
        const cloneFormData = JSON.parse(JSON.stringify(this.formdata));
        this.$refs.formRefs.validate((valid) => {
          if (valid) {

            if (this.formdata.totalPrice !== undefined) {
              if (this.formdata.applicability == undefined) {
                this.$message.warning("请选适用性别");
                return;
              }
            }
            for (let index = 0; index < this.tableData.length; index++) {
              const element = this.tableData[index];
              if (!element.checkMethod) {
                this.$message.warning("请填写检查方式");
                return;
              }
              if (!element.checkName) {
                this.$message.warning("请填写检查项目");
                return;
              }
              if (!element.significance) {
                this.$message.warning("请填写临床意义");
                return;
              }
              if (element.totalPrice === "" && !element.manPrice && !element.womanPrice) {
                this.$message.warning("请填写至少一项价格且价格大于0至多保留两位小数");
                return;
              }

              if ((element.manPrice <= 0 && element.manPrice) || (element.womanPrice && element.womanPrice <= 0)) {
                this.$message.warning("请填写至少一项价格且价格大于0至多保留两位小数");
                return;
              }
              if (element.manPrice && element.manPrice.toString().split(".")[1] && element.manPrice.toString().split(".")[1].length > 2) {
                this.$message.warning("请填写至少一项价格且价格大于0至多保留两位小数");
                return;
              }
              if (element.womanPrice && element.womanPrice.toString().split(".")[1] && element.womanPrice.toString().split(".")[1].length > 2) {
                this.$message.warning("请填写至少一项价格且价格大于0至多保留两位小数");
                return;
              }
            }
            // 套餐内容-其他项
            for (let i = 0; i < this.tableData1.length; i++) {
              const el = this.tableData1[i];
              if (!el.checkName && !el.significance && !el.manPrice && !el.womanPrice) {
                this.tableData1.splice(i, 1);
              }
            }

            if (this.tableData1.length) {
              for (let i = 0; i < this.tableData1.length; i++) {
                const res = this.tableData1[i];
                if (!res.checkName) {
                  this.$message.warning("请填写检查项目");
                  return;
                }
                if (!res.manPrice && !res.womanPrice && (res.manPrice != undefined || res.womanPrice != undefined)) {
                  this.$message.warning("请填写至少一项价格且价格大于0至多保留两位小数");
                  return;
                }

                if ((res.manPrice <= 0 && res.manPrice) || (res.womanPrice && res.womanPrice <= 0)) {
                  this.$message.warning("请填写至少一项价格且价格大于0至多保留两位小数");
                  return;
                }
                if (res.manPrice && res.manPrice.toString().split(".")[1] && res.manPrice.toString().split(".")[1].length > 2) {
                  this.$message.warning("请填写至少一项价格且价格大于0至多保留两位小数");
                  return;
                }
                if (res.womanPrice && res.womanPrice.toString().split(".")[1] && res.womanPrice.toString().split(".")[1].length > 2) {
                  this.$message.warning("请填写至少一项价格且价格大于0至多保留两位小数");
                  return;
                }
              }
            }

            for (let i = 0; i < this.tableData2.length; i++) {
              const el = this.tableData2[i];
              if (!el.checkName && !el.significance && !el.manPrice && !el.womanPrice) {
                this.tableData2.splice(i, 1);
              }
            }

            if (this.tableData2.length) {
              for (let i = 0; i < this.tableData2.length; i++) {
                const ele = this.tableData2[i];
                if (!ele.checkName || !ele.significance) {
                  this.$message.warning("请完善可选服务套餐内容");
                  return;
                }
                if (!ele.manPrice && !ele.womanPrice) {
                  this.$message.warning("请填写至少一项价格且价格大于0至多保留两位小数");
                  return;
                }

                if ((ele.manPrice <= 0 && ele.manPrice) || (ele.womanPrice && ele.womanPrice <= 0)) {
                  this.$message.warning("请填写至少一项价格且价格大于0至多保留两位小数");
                  return;
                }
                if (ele.manPrice && ele.manPrice.toString().split(".")[1] && ele.manPrice.toString().split(".")[1].length > 2) {
                  this.$message.warning("请填写至少一项价格且价格大于0至多保留两位小数");
                  return;
                }
                if (ele.womanPrice && ele.womanPrice.toString().split(".")[1] && ele.womanPrice.toString().split(".")[1].length > 2) {
                  this.$message.warning("请填写至少一项价格且价格大于0至多保留两位小数");
                  return;
                }
              }
            }

            if (!this.tableData2.length) {
              this.tableData3 = [];
            }
            for (let i = 0; i < this.tableData3.length; i++) {
              const response1 = this.tableData3[i];
              if (!response1.checkName && !response1.significance && !response1.manPrice && !response1.womanPrice) {
                this.tableData3.splice(i, 1);
              }
            }

            if (this.tableData3.length) {
              for (let i = 0; i < this.tableData3.length; i++) {
                const response = this.tableData3[i];
                if (!response.checkName) {
                  this.$message.warning("请填写检查项目");
                  return;
                }
                if (!response.manPrice && !response.womanPrice) {
                  this.$message.warning("请填写至少一项价格且价格大于0至多保留两位小数");
                  return;
                }

                if ((response.manPrice <= 0 && response.manPrice) || (response.womanPrice && response.womanPrice <= 0)) {
                  this.$message.warning("请填写至少一项价格且价格大于0至多保留两位小数");
                  return;
                }
                if (response.manPrice && response.manPrice.toString().split(".")[1] && response.manPrice.toString().split(".")[1].length > 2) {
                  this.$message.warning("请填写至少一项价格且价格大于0至多保留两位小数");
                  return;
                }
                if (response.womanPrice && response.womanPrice.toString().split(".")[1] && response.womanPrice.toString().split(".")[1].length > 2) {
                  this.$message.warning("请填写至少一项价格且价格大于0至多保留两位小数");
                  return;
                }
              }
            }
            if (this.supplementList.length === 0) {
              this.$message.warning('补充说明至少添加一项');
              return
            } else {
              for (let index = 0; index < this.supplementList.length; index++) {
                const element = this.supplementList[index];
                if (!element.value) {
                  this.$message.warning("补充说明不能为空");
                  return;
                }
              }
            }


            // 推广费用
            if (this.formdata.extendFee == 0) {
              this.formdata.extendFee = undefined
            }
            if ((this.formdata.extendFee && this.formdata.extendFee.toString().split(".")[1] && this.formdata.extendFee.toString().split(".")[1].length > 2)) {
              this.$message.warning('每单推广费用大于0且至多两位小数')
              return
            }
            if (this.formdata.totalPrice === '') {
              if (this.formdata.extendFee >= (this.formdata.womanPrice - this.formdata.manPrice > 0 ? this.formdata.manPrice : this.formdata.womanPrice)) {
                this.$message.warning('推广费用必须低于套餐价格')
                return
              }
            } else {
              if (this.formdata.extendFee >= this.formdata.totalPrice) {
                this.$message.warning('推广费用必须低于总价格')
                return
              }
            }
            // 推广方式默认为1
            if (this.formdata.extendFee) {
              this.formdata.way = 1;
            } else {
              this.formdata.way = null;
            }
            cloneFormData.physicalExamItemList = this.tableData.concat(this.tableData1.concat(this.tableData2.concat(this.tableData3)));
            // 补充说明
            let newSupplementList = [];
            this.supplementList.forEach(ele => {
              newSupplementList.push(ele.value);
            });
            cloneFormData.supplement = JSON.stringify(newSupplementList);
            // 体检院区
            cloneFormData.hospitalBranchIds = JSON.stringify(this.formdata.hospitalBranchIds);
            // 适用对象
            cloneFormData.applicableThrongIds = JSON.stringify(this.formdata.applicableThrongIds);
            // 套餐特点
            cloneFormData.characteristicIds = JSON.stringify(this.formdata.characteristicIds);
            this.post(this.api.cooperationHospital.physicalExamUploadInfo, cloneFormData).then(res => {
              if (res.data.code === '200') {
                this.$message.success(res.data.message);
                this.$emit("closedialog");
              }
            });
          }
        })
      },
      handleAvatarSuccess (res) {
        this.formdata.imageUrl = res.object[0];
      },
      beforeAvatarUpload (file) {
        const isLt2M = file.size / 1024 / 1024 < 2;
        if (!isLt2M) {
          this.$message.error("上传头像图片大小不能超过 2MB!");
        }
        return isLt2M;
      },
      gethospitalList (query) {
        if (query !== "") {
          this.loading1 = true;
          this.post(this.api.cooperationHospital.getHospitalList, {
            pageSize: 100,
            pageIndex: 0,
            searchCondition: query,
            selectHospitalIds: []
          }).then(res => {
            this.options1 = res.data.object;
          });
        } else {
          this.options1 = [];
        }
        this.loading1 = false;
      },
      // 选择性别
      chagneSex (val) {
        this.formdata.applicability = val;
      },
    },
    created () {
      this._getList();
      this._getList1();
      if (this.dialogData.info) {
        this.title = '编辑体检';
        let resData = this.dialogData.info;
        this.formdata = resData;
        // 回显客户医院
        this.options1 = [{
          hospitalId: resData.hospitalId,
          name: this.dialogData.row.hospitalName
        }];
        // 适用对象
        this.formdata.applicableThrongIds = JSON.parse(resData.applicableThrongIds);
        // 套餐特点
        this.formdata.characteristicIds = JSON.parse(resData.characteristicIds);
        // 根据客户医院 查询 体检院区
        this.formdata.hospitalBranchIds = JSON.parse(resData.hospitalBranchIds);
        if (this.formdata.hospitalBranchIds.length > 0) {
          this.hospitalChange(resData.hospitalId);
        }
        // 回显补充说明
        JSON.parse(resData.supplement).forEach(item => {
          this.supplementList.push({ value: item })
        })
        this.tableData = this.formdata.physicalExamItemList.filter(
          ele => ele.type == 1
        );
        this.tableData1 = this.formdata.physicalExamItemList.filter(
          ele => ele.type == 2
        );
        this.tableData2 = this.formdata.physicalExamItemList.filter(
          ele => ele.type == 3
        );
        this.tableData3 = this.formdata.physicalExamItemList.filter(
          ele => ele.type == 4
        );
      } else {
        this.title = '新增体检'
      }
      this.post(this.api.cooperationHospital.getPhysicalExamBusinessList).then(
        res => {
          if (res.data.code === '200') {
            this.options = res.data.object;
          }
        }
      );
    }
  };
</script>

<style>
  .avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
  }
  .avatar-uploader .el-upload:hover {
    border-color: #409eff;
  }
  .avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 98px !important;
    height: 98px !important;
    line-height: 98px !important;
    text-align: center;
  }
  .avatar {
    width: 98px !important;
    height: 98px !important;
    display: block;
  }
</style>
